<template>
  <el-form-item label="输入框占位文本">
    <el-input v-model="obj.info"></el-input>
  </el-form-item>
  <el-form-item label="组件类型">
    <el-radio-group v-model="obj.props.type">
      <el-radio-button label="text">输入框</el-radio-button>
      <el-radio-button label="textarea">多行文本</el-radio-button>
      <el-radio-button label="password">密码输入框</el-radio-button>
    </el-radio-group>
  </el-form-item>
  <el-form-item label="最大输入长度">
    <el-input-number v-model.number="obj.props.maxlength" :min="0"></el-input-number>
  </el-form-item>
  <el-form-item label="最小输入长度">
    <el-input-number v-model.number="obj.props.minlength" :min="0"></el-input-number>
  </el-form-item>
  <el-form-item label="是否显示输入字数统计">
    <el-switch v-model="obj.props.showWordLimit"></el-switch>
  </el-form-item>
  <el-form-item label="是否可清空">
    <el-switch v-model="obj.props.clearable"></el-switch>
  </el-form-item>
  <el-form-item label="是否显示切换密码图标">
    <el-switch v-model="obj.props.showPassword"></el-switch>
  </el-form-item>
  <el-form-item label="是否禁用">
    <el-switch v-model="obj.props.disabled"></el-switch>
  </el-form-item>
  <!-- <el-form-item label="输入框头部图标">
    <el-input v-model="obj.props.prefixIcon"></el-input>
  </el-form-item>
  <el-form-item label="输入框尾部图标">
    <el-input v-model="obj.props.suffixIcon"></el-input>
  </el-form-item> -->
</template>

<script lang="ts">
export default {
  name: 'jInputConfig'
}
</script>

<script lang="ts" setup>
import { toRefs, defineProps } from 'vue'
import { type Basis } from '@/types/element'
const props = defineProps<{
  obj: Basis
}>()
const { obj } = toRefs(props)
</script>

<style scoped></style>
